<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>

</html>
<!-- - #笔记要求

    ##笔记
    - 每日边看视频边记录笔记，然后每个知识点需要自己解释一下
    - 以及 每日未解决的问题可以记录下来
    - 记录每日完成多少代码量（多少行）
    - 今天做了什么
    有做项目的话，项目的进度 -->
ctx.fillStyle = 'rgba(0,0,0,.5)'颜色 /strokeStyle

ctx.fillRect(x,y,width,height)长方形

绘制路径，点变成线，线变成面

ctx.beinPath(0,0)：在钢笔当前所在位置开始绘制一条路径，在新画布中的起始点位置

ctx.moveTo（）：将钢笔移动至另一个坐标点，不记录，不留痕迹，将钢笔“跳”至新位置

ctx.fill（）：通过为当前所绘制路径的区域填充颜色来绘制一个新的填充形状

ctx.stroke()：通过为当前所绘制路径的区域描边，来绘制一个只有边框的形状

画圈：context.arc(centextX,centextY,100,0,Math.PI*2,false)
圆心x坐标，圆心Y坐标，圆半径，圆起始弧度，终止弧度，顺时针 false/逆时针 true

文本：这两个函数用于文本 fillText():绘制有填充色的文本
strokeText():绘制文本外边框（描边）
context.docwImage(img,200,200,200,200,200,200,200,200,200)
image对象 裁切开始X坐标 裁切开始的Y坐标 裁切的width 裁切的height
放置的x坐标 放置的y坐标 显示图片的width 显示图片的height